<template>
  <div class="self-tree">
      <div class="hidanger-lab" @click="chosepointpath">工点<label class="hidanger-chosetask" v-if="(pointName == null)" style="padding-right:12px"><slot name="pointNamechosetask"></slot><label class="chosetask-lab"></label></label><label class="hidanger-chosetask" style="color:#343434;padding-right:12px"><slot name="pointName"></slot><label class="chosetask-lab" v-if="(pointName != null)"></label></label></div>
      <popup v-model="value" height="100%" @on-show="getDate()">
          <popup-header right-text="确定" title="选择工点" :show-bottom-border="false" @on-click-right="check"></popup-header>
          <pointTreeRoot v-on:selectvalue1="selectvalue1" :list="list" v-for="(item,index) in list" :key="index" :item="item" :pathid="pathid"><div slot="test">{{item.NAME}}</div></pointTreeRoot>
      </popup> 
  </div>
</template>

<script>
import pointTreeRoot from "./pointTreeRoot"
export default {
  name: "pointpathlist",
  components: {
    pointTreeRoot
  },
  data () {
    return {
      list: [],
      page: 1,
      keyword: '',
      createPop: false,//弹出层是否创建
      loading: false,//下拉刷新时禁止无限加载
      value:false,
      nodes:[],
      checkmisscontent:null,
      treeList:[],
      pointInfo:[],
      pointName:null,
      pathid:""
    }
  },
  methods: {
       selectvalue1(data){
            this.pointInfo = data;
            this.pathid = this.pointInfo[1];
       },
       chosepointpath(){
           this.value=true;
       },
       check(){
           this.value=false;
           this.pointName = this.pointInfo[0];
           this.$emit('selectvalue', this.pointInfo);
       },
       /*getDate(){    
           var params = '{"source":"","bizObj":"SZJC_PROJECTBASEINFO","service":"selectMoreHasAuth","parentField":"PARENTID","childField":"ID","showField":"NAME","appendFields":["GUID","ID","NAME","TYPE","PATHID","PARENTID","PARENTNAME","SORTID"],"filter":"1=1","orderList":[],"_param":{"refKey":""},"_method":"component.getTreeDataAsyn"}';  
           this.$ajax({
                    method: 'post',
                    url: '/sxdtpm/servlet/Action.cmd',
                    data: {
                      node:1,
                      FixJSON: params
                    }
                }).then((res) => {
                     console.log(res.data);
                     this.list = res.data;
                     this.treeList.push(res.data.treedata);
                     console.log(this.treeList);
                     for(var i=0;i<this.list.nodes.length;i++){
                         node = this.list.nodes[i].id;
                         var leaf = this.list.nodes[i].leaf;
                         if(leaf == false)
                            this.getDate(node);
                      } 
                }).catch((err)=>{
                     console.log(err);
                });
       },*/
       getDate(){    
           var params = '{"source":"","bizObj":"SZJC_PROJECTBASEINFO","service":"selectMoreHasAuth","parentField":"PARENTID","childField":"ID","showField":"NAME","appendFields":["GUID","ID","NAME","TYPE","PATHID","PARENTID","PARENTNAME","SORTID"],"filter":"1=1","orderList":[],"_param":{"refKey":""},"_method":"component.getTreeDataAsyn"}';  
           this.$ajax({
                    method: 'post',
                    // url: '/sxdtpm/servlet/Action.cmd',
                    url:this.COMMON_URL,
                    data: {
                      node:1,
                      FixJSON: params
                    }
                }).then((res) => {
                     console.log(res.data);
                     this.list = res.data.treedata;
                     console.log(res.data.treedata);
                }).catch((err)=>{
                     console.log(err);
                });
       },
  }
}
</script>

<style> 
    .hidanger-lab{
        margin-top: 13px;
        margin-bottom: 13px;
        margin-left: 40px;
        margin-right: 40px;
        color: #9F9F9F;
        font-size: 13px;
    }
    .hidanger-chosetask{
      text-align: right;
      float: right;
    }
    .chosetask-lab:after{
    content: " ";
    height: 6px;
    width: 6px;
    border-width: 2px 2px 0 0;
    border-color: #C8C8CD;
    border-style: solid;
    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
    position: absolute;
    margin-top: 6px;
    margin-left: 5px;
    clear: both;
    float: right;
  }

  .accordion {
    width: 100%;
    margin: 0 auto;
    background: #FFF;
  }

  .accordion .link {
    display: block;
    padding: 15px 15px 15px 42px;
    font-size: 14px;
    position: relative;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }

  .link:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    border-top: 1px solid #D9D9D9;
    color: #D9D9D9;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
  }

  .link:active {
    background-color: #ECECEC;
  }

  .accordion li i {
    position: absolute;
    left: 12px;
    top: 50%;
    margin-top: -8px;
    font-size: 16px;
    color: #999999;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }

  .accordion li i.fa-chevron-down {
    font-size: 16px;
  }


  .openImg {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  /**
   * Submenu
   -----------------------------*/
  .submenu {
    overflow: hidden;
    padding: 0 10px;
    opacity: 0;
    max-height: 0px;
    font-size: 14px;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }

  .openChild {
    max-height: 10000vh;
    opacity: 1;
    display: block;
  }

  li {
    list-style-type: none;
  }
    .accordion .noline::before{
    border-top:0;
  }
</style>